<!doctype html>
<html class="no-js fixed-layout">
<head>
	<!-- 公共head Begin -->
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="keywords" content="萌宠之家-C2B2C社会化电商平台" />
	<meta name="description" content="《萌宠之家-C2B2C社会化电商平台》是一个基于宠物社区的一站式电商平台。" />
	<!-- minimum-scale=1.0, maximum-scale=1.0 不加这两个在iPhone浏览器下点击缩小了的输入框会使整个页面变大 -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
	<title>萌宠之家-C2B2C社会化电商平台</title>

	<!-- Set render engine for 360 browser -->
	<meta name="renderer" content="webkit">

	<!-- No Baidu Siteapp-->
	<meta http-equiv="Cache-Control" content="no-siteapp"/>

	<link rel="icon" type="image/png" href="statics/img/favicon.png">

	<!-- Add to homescreen for Chrome on Android -->
	<meta name="mobile-web-app-capable" content="yes">
	<link rel="icon" sizes="192x192" href="statics/img/app-icon72x72@2x.png">

	<!-- Add to homescreen for Safari on iOS -->
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-title" content="Pet Mall"/>
	<link rel="apple-touch-icon-precomposed" href="statics/img/app-icon72x72@2x.png">

	<!-- Tile icon for Win8 (144x144 + tile color) -->
	<meta name="msapplication-TileImage" content="statics/img/app-icon72x72@2x.png">
	<meta name="msapplication-TileColor" content="#0e90d2">

	<link rel="stylesheet" href="statics/AmazeUI/assets/css/amazeui.min.css">
	<link rel="stylesheet" href="statics/AmazeUI/assets/css/shop.css">

	<!--[if (gte IE 9)|!(IE)]><!-->
	<script src="statics/AmazeUI/assets/js/jquery.min.js"></script>
	<!--<![endif]-->

	<script src="statics/js/plugin/jquery.cookie.js"></script>

	<!-- 此处form的导入和amazeui.min.js会有冲突，请根据需要使用 -->
	<script src="statics/js/plugin/jquery.form.js"></script>

	<script src="statics/js/jquery.lSelect.js"></script>
	<script src="statics/js/plugin/jquery.metadata.js"></script>
	<script src="statics/js/plugin/jqPaginator.min.js"></script>
	<script src="statics/js/product.js"></script>
	<!-- 公共head End -->
</head>
<body>
<!-- 网页头部 Begin -->
<div class="header"></div>
<!-- 网页头部 End -->
<div class="am-cf shop-main">
  <!-- content start -->
  <div class="shop-content">
    <div class="shop-content-body">
      <div class="am-panel am-panel-default am-margin am-text-xs">
        <div class="am-panel-hd"><span class="am-icon-star am-icon-sm"></span>
			<strong id="lblUsername" class="am-text-primary am-text-default">-</strong>的萌宠列表</div>
        <div class="am-panel-bd am-g am-padding-0 am-scrollable-horizontal">
          <table id="tblProductList" class="am-table am-table-bordered am-table-striped am-table-hover am-text-nowrap am-text-xs am-margin-bottom-0">
            <thead>
              <tr>
                <th>宠物名称</th>
			    <th>分类</th>
				<th>售价</th>
				<th>销量</th>
				<th>访问量</th>
				<th>粉丝数</th>
				<th>数量</th>
              </tr>
            </thead>
            <tbody class="listTable">
            </tbody>
          </table>
			<h3 id="noData" style="display: none;" class="am-text-xs am-text-center am-text-danger">该主人目前没有发布任何宠物!</h3>
          </div>
		  <!-- 分页 -->
		  <hr data-am-widget="divider" class="am-divider am-divider-dashed am-margin-0" />
		  <div id="divPagination" class="am-margin-left am-text-xs">
			  <ul id="pagination" class="am-pagination"></ul>
		  </div>
        </div>
      </div>
    </div>
  </div>
  <!-- content end -->
</div>
</body>
<script src="statics/AmazeUI/assets/js/amazeui.min.js"></script>
<script src="statics/AmazeUI/assets/js/amazeui.modal.js"></script>
<script src="statics/js/base.js"></script>
<script src="statics/AmazeUI/assets/js/validator.js"></script>
<script type="text/javascript">

    // 购物车列表
    let cartList = new Array();

    // 商品分类列表
    let categoryList = new Array();

    // 卖家用户id
    let sellerId = GetQueryString('id');

    // 查询条件对象
    let queryObject = new Object();
    queryObject.userId = sellerId;
    queryObject.statusList = "6";

    $().ready( function() {


        // 加载公共顶部模板
        $('.header').load('header.html');

        // 加载'商品分类'列表
        loadCategoryList();

        // 加载'商品'列表数据
        loadProductList();

    });// $().ready();

/**	加载'商品分类'列表数据 **/
function loadCategoryList() {

	// 加载'商品分类'数据
	$.ajax({
		type: 'POST',
		url: 'http://localhost:8080/category/getAll',
		async: false,
		success: function (result) {

			// 如果返回的数据的响应码不是'成功(200)'
			if (result.code != 200) {
				Modal.alert(result.msg);
				return;
			}

			// 如果返回的数据响应码为200
			// 就进行表格数据填充
			categoryList = result.data;

		}// success();

	});// $.post();

}// loadCategoryList();

/**	加载'商品'列表数据 **/
function loadProductList() {

	// 加载'商品列表'数据
	$.post('http://localhost:8080/product/search', queryObject, function (result) {

		// 如果返回的是token失效，就重新登录
		if(result.code == 419) {

			Modal.confirm('当前会话token失效，请重新登录页面！', {
				closeViaDimmer: false,
				onConfirm: function() {
					top.location.href = 'admin_login.html';
				},
				onCancel: function() {
					top.location.href = 'admin_login.html';
				}
			});// Modal.confirm();

			return;
		}// if(result.code == 419);

		// 如果返回的数据的响应码不是'成功(200)'
		if(result.code != 200) {
			Modal.alert(result.msg);
			return;
		}

		// 如果返回的数据响应码为200
		// 就进行表格数据填充
		let pageResult = result.data;

		productList = pageResult.list;

		// 填充表格数据
		fillProductList();

		// 初始化分页插件
		$("#pagination").remove();
		$("#divPagination").append('<ul id="pagination" class="am-pagination"></ul>');

		$.jqPaginator( '#pagination', {
			totalPages: pageResult.pages,
			totalCounts:pageResult.total,
			visiblePages: 10,
			currentPage: pageResult.pageNum,
			prev: '<li><a href="javascript:void(0);"><span class="am-icon-arrow-circle-left"></span> 上一页</a></li>',
			next: '<li><a href="javascript:void(0);">下一页 <span class="am-icon-arrow-circle-right"></span></a></li>',
			page: '<li><a href="javascript:void(0);">{{page}}</a></li>',
            activeClass: 'am-active',
			onPageChange:function( num, type ){

				// 加载指定页码数据
				if (type == 'change'){
					queryObject.currentPage = num;
					loadProductList();
				}

			}// onPageClick();

		});// $("#pagination").twbsPagination();

		$("#pagination").append('<li>共' + pageResult.pages + '页</li>');

	});// $.post();

}// loadProductList();

/** 填充表格数据 **/
function fillProductList( ) {

	// 清空表格数据
	$('#tblProductList tbody').empty();
	// 隐藏显示提示
	$('#noData').hide();

	// 如果没有集合数据，就直接返回
	if( !productList || productList.length == 0 ){
		// 设置没有数据提示
		$('#noData').show();
		return;
	}// if();

	// 填充用户名
	$('#lblUsername').html(productList[0].username);

	// 循环构造单元格数据，并进行填充
	for( let i = 0; i < productList.length; i++ ) {

		let product = productList[i];

		let trId = '<tr id="listTr' + product.id + '">';

        // 商品名称
        let tdName = '<td class="productName"><a href="product_content.html?id=' + product.id + '&cid=' + product.categoryId + '">';

        // 商品图片
        let tdImage = '<img width="90px" height="90px" style="border: 1px solid #ddd;" src="' + IMAGE_URL_CONST.PRODUCT + product.mainImage + '" />&emsp;';

        // 封装商品名称
        tdName += tdImage + product.name + '</a></td>';

		// 分类
		let tdCategory = '<td class="am-text-middle">' + getCategoryPath(product.categoryId) + '</td>';

		// 价格
		let tdPrice = '<td class="am-text-middle">' + priceCurrencyFormat(product.price) + '</td>';

		// 销量
		let tdSellNum = '<td class="am-text-middle">' + product.sellNum + '</td>';

		// 访问量
		let tdViewNum = '<td class="am-text-middle">' + product.viewNum + '</td>';

		// 粉丝数
		let tdFollowNum = '<td class="am-text-middle">' + product.followNum + '</td>';

		// 库存
		let tdStock = '<td class="am-text-middle">' + product.stock + '</td>';

		// 封装整条tr单元格
		trId += tdName + tdCategory + tdPrice + tdSellNum + tdViewNum + tdFollowNum + tdStock + '</tr>';

		// 将构造好的单元格数据，填充到表格中
		$('#tblProductList tbody').append(trId);

	}// for();

}// fillProductList();

/** 根据商品分类id，获取商品分类路径信息 **/
function getCategoryPath( categoryId ) {

	// 分类路径
	let categoryPath = "";

	// 父分类id
	let parentCategoryId;

	// 子分类名称
	let childCategoryName;

	// 循环查找父分类id
	for( let i = 0; i < categoryList.length; i++ ) {

		let category = categoryList[i];

		// 如果当前分类的id，等于传入的分类id
		if( category.id == categoryId ){
			// 设置父分类id
			parentCategoryId = category.parentId;
			// 设置子分类名称
			childCategoryName = category.name;
			break;
		}

	}// for();

	// 循环查找父分类名称
	for( let i = 0; i < categoryList.length; i++ ) {

		let category = categoryList[i];

		// 如果当前分类的父id，等于找到的父分类id
		if( category.id == parentCategoryId ){
			// 设置当前父分类名称路径
			categoryPath = category.name + '&nbsp;->&nbsp;' + childCategoryName;
			break;
		}

	}// for();

	return categoryPath;


}// getCategoryPath( categoryId );
</script>
</html>